<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="__ROOT__/Public/Admin/css/shortcut icon" href="favicon.ico"> 
    <link href="__ROOT__/Public/Admin/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="__ROOT__/Public/Admin/css/animate.css" rel="stylesheet">
    <link href="__ROOT__/Public/Admin/css/style.css?v=4.1.0" rel="stylesheet">
	<link href="__ROOT__/Public/Admin/css/jquery.treetable.css" rel="stylesheet"/>
	<link href="__ROOT__/Public/Admin/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">
	<link href="__ROOT__/Public/Admin/css/official.css" rel="stylesheet">
    <style>
		.nav-tabs{
			margin-bottom: 20px;
		}
		.err-tip-color{
			color:#ed2a2a;
		}
		#content-main{height: calc(100%) !important;}
		<if condition="APP_DEBUG">
				#think_page_trace_open{
					z-index:9999;
				}
		</if>
		.loading{
			 width: 35px;
			 height: 35px;
			 margin: 0 auto;
			 margin-top:100px;
			 position: fixed;
			 top: 0px;
			 left: 0px;
			 right: 0px;
			 bottom: 0px;
			 margin: auto;
		}
    </style>
</head>
<body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="ibox float-e-margins">
            <div class="ibox-content">
				<ul class="nav nav-tabs">
                    <li class="active"><a href="#"><i class="fa fa-user"></i> 列表</a>
                    </li>
                </ul> 
				<table class="table table-hover table-bordered table-list" id="cates-table">
					<thead id="thead">
						<tr>
							<th width="50"></th>
							<th width="50">序号</th>
							<th>部门名称</th>
							<th width="180">操作</th>
						</tr>
					</thead>
					<tbody>
						<volist name="list" id="vo">
							<tr data-node-id="{$vo.ID}" id="{$vo.ID}" lv="1"> 
								<td style="padding-left:20px;" class="expander"></td>
								<td>{$vo.ID}</td>
								<td>{$vo.Name}</td>
								<td>
								 <a class="js-ajax-delete" href="javascript:select({$vo.ID},'{$vo.Name}');">选择</a></td>
							</tr>
							<if condition="$vo.coutsonID gt 0"><tr data-node-id="0" data-parent-id="{$vo.ID}"></tr></if>  
						</volist>
						<if condition="count($list) lt 1">
	                        <tr>
	                            <td colspan="6" class="text-center">查无数据</td>
	                        </tr>
                        </if>
					</tbody>
				</table>
			</div>
        </div>
    </div>
	<script src="__ROOT__/Public/Admin/js/jquery.js"></script>  
    <script src="__ROOT__/Public/Admin/js/treetable/jquery.treetable.js"></script>
	<script src="__ROOT__/Public/Admin/js/plugins/sweetalert/sweetalert.min.js"></script>
	<script>
	var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
		$(function(){  
            $("#cates-table").treetable({  
                nodeIdAttr: "nodeId",  
                parentIdAttr: "parentId",  
                stringCollapse: "收起",  
                stringExpand: "展开",  
                expandable: true,
                //展开  
                onNodeExpand: function(){  
                    var node = this;
					if(node.children.length == 1){		
						var id = node.id;  //需要添加节点的ID 
						getDepartmentList(id);
					}
                }  
            }).on("click",".del",function(e){  
                e.preventDefault();  
                var id = $(this).closest("tr").data("node-id");               
                $("#example-basic").treetable("removeNode",id);  
            }).on("click",".add",function(e){  
                e.preventDefault();  
                var id = $(this).closest("tr").data("node-id");  //需要添加节点的ID 
                var html = loadHtml(id);  // 需要添加的节点HTML
                var node = $("#example-basic").treetable("node",id);  //需要添加节点的对象 
  
                $("#example-basic").treetable("loadBranch",node,html);  
                  
                //修改节点图标  
                $(this).closest("tr").find("td .file").removeClass("file").addClass("folder");  
            });			
        })
		
		//获取部门列表数据
		function getDepartmentList(ParentID){
		    $(".loading").show();
			$.post("{:U('Organization/show')}",{ParentID:ParentID},function(result){
				for(obj in result){
					var lvhtml = "";
					var lvnum = $("#"+ParentID).attr("lv");
					for(var i=0; i < lvnum * 6; i++){
						lvhtml += "&nbsp";
					}
					if(obj == (result.length-1)){
						lvhtml += "└─ ";
					}else{
						lvhtml += "├─ ";
					}
					lvnum++;
					var html = "<tr data-node-id='" + result[obj].ID + "'  data-parent-id='" + ParentID + "'lv='" + lvnum + "'id='" + result[obj].ID +"'><td style='padding-left:20px;' class='expander'></td><td>" + result[obj].ID + "</td><td>" + lvhtml + result[obj].Name + "</td><td><a class='js-ajax-delete' href='javascript:select("+  result[obj].ID + ",\""+result[obj].Name+"\")' >选择</a></td></tr>"; //需要添加的HTML节点
					if(result[obj].coutsonID > 0){
						html += "<tr data-node-id='0' data-parent-id='" + result[obj].ID + "'></tr>";
					}
					var node = $("#cates-table").treetable("node",ParentID);  //需要添加节点的对象 
					$("#cates-table").treetable("loadBranch",node,html); 	
				}
				$(".loading").hide();
			});
		}
		
		function select(id,name){
			var IDD="#{:I('type')}";
			var IDDNAME="#{:I('type')}Name";
			parent.$(IDD).val(id);
            parent.$(IDDNAME).val(name);
            parent.layer.close(index);
            return false;
		}

		
    </script>
<img src="__ROOT__/Public/Admin/img/loading.gif" class="loading" style="display:none;">
</body>
</html>